import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { ListViewPage } from "weaver-mobile-page";
import { Tabs, Icon } from "weaver-mobile";
import { withRouter } from 'react-router-dom';
import SearchConponent from "../common/SearchConponent";

import * as allFun from "../../../workflowForm/util/forwardPage";

@withRouter
@inject("docTodoStore")
@observer
class DocToDo extends Component {
  static defaultProps = {
    prefixCls: "odoc-todo"
  }

  componentDidMount() {
    const { docTodoStore, location } = this.props
    const officalType = location.query && location.query.officalType;
    docTodoStore.setOfficalType(officalType)
    docTodoStore.getTabs();
    docTodoStore.getList();
    docTodoStore.getUserId();
  }

  render() {
    const { prefixCls, docTodoStore, location, history } = this.props;
    const pathname = location.pathname;
    const { tabs, changeTab, officalType } = docTodoStore;
    return (
      <div className={`${prefixCls}`}>

        <Tabs
          tabs={tabs}
          onChange={(tab, index) => changeTab(tab, index)}
          page={Number.parseInt(officalType)}
        />

        <SearchConponent
          getCondition={{
            url: "/api/odoc/odocSearchReq/getCondition",
          }}// 高级搜索form表单接口参数  默认是 没有url，post，没有参数
          pathname={pathname} //原路由地址
          extraButton={["advanced"]}
          baseSearchKey={"requestname"}
          getSearchData={formParams => this.getSearchData(formParams)}
          history={history}
        />


        {this.getTableList()}
      </div>
    )
  }

  getSearchData(formParams) {
    const { docTodoStore, history } = this.props;
    docTodoStore.getList(formParams)
  }

  getTableList() {
    const { docTodoStore, prefixCls } = this.props;
    const { list, dropDown, loading } = docTodoStore;
    const items =
      <div style={{ height: `calc(100% - 90px)` }}>
        <ListViewPage.Normal
          store={list}
          getTemplate={this.getTemplate}
          onRowClick={(rowData) => this.forwardPage(rowData)}
        />
      </div>
    return items;
  }


  getTemplate() {
    const newTemplate = {
      default: [
        // {
        //   key: 'col1',
        //   style: { flex: 'none' },
        //   render(item) {
        //     return <div className={`odoc-todo-table-item`}>{item.odoctypespan}</div>
        //   },
        // },
        {
          key: 'col2',
          configs: [
            {
              key: 'row1',
              render(item) {
                return (
                  <div className={`wm-list-page-item-row-span wm-list-page-item-row-span-text-highlight`}>
                    {item.requestnamespan}
                    {item.viewtypespan === '0' && <span className="redDot"></span>}
                    {item.viewtypespan === '1' && <span className="yellowDot"></span>}
                    {item.viewtypespan === '3' && <span className="purpleDot"></span>}
                  </div>
                )
              },
            },
            {
              key: 'row2',
              style: { color: '#999999' },
              configs: [{ key: 'createrspan', style: { marginRight: '10px' } }, { key: 'createdatespan' }],
            }
          ]
        },
      ],
    };
    return newTemplate;
  }

  forwardPage(rowData) {
    const { docTodoStore } = this.props;
    allFun.forwardViewForm('requestid=' + rowData.requestid + '&f_weaver_belongto_userid=' + rowData.userid, (arg) => {
      docTodoStore.getList();
      // if (typeof arg === "string") {
      //     arg = JSON.parse(arg);
      // }
      // const { isReturn = false } = arg;
      // if (isReturn || (!isReturn && showCheck)) {//走的返回
      //     onSearch({ notClearSelectedRowKeys: true });//不清空selectedRowKeys
      // } else {//走的提交
      //     onSearch();
      // }
    }, "portal")
  }


}


export default DocToDo;